<!DOCTYPE html>
<html>
    <header>
        <meta charset="utf-8" >
        <title>作业3</title>
        <div>
        <img src="https://tenfei03.cfp.cn/creative/vcg/800/new/VCG41N1192087152.jpg">
        </div>
        <div class="all">
            <span class="title">首页</span> 学习 美食 电影
            <div class="content">
            <a href="#">子网页</a>
            <a href="#">孙网页</a>
            <a href="#">后网页</a>
            </div>
        </div>
        <nav class="over">
        <div>数学</div>
        <div>语文</div> 
        <div>音乐</div>
        <div>英语</div>
        </nav>
    </header>
    <main>
        <style>
            .over div{
                float: left;
                margin: 3px 8px;
                font-size: large;
            }
            .over::after{
                clear: both;
                content: '';
                display: block;
            }
            .over{
                position: absolute;
                top: 20px;
                right: 0;
            }
            header{
                position: relative;
            }
        header img{
                width: 100%;
                height: 300px;
            }
            .side div{
                offset: top;
                margin: 3px 8px;
                font-size: large;
                background-color: aqua;
                width: 20%;
            }
            .side::after{
                clear: both;
                content: '';
                display: block;
            }
            .side{
                position: fixed;
                top: 20px;
                right: 0;
            }
            .all {
                position: relative;
                display: inline-block;
            }
            .all {
            background-color: black;
            color: white;
            padding: 16px;
            font-size: 16px;
            border: none;
            cursor: pointer;
            width: 150px;
            margin: 0 auto;
            display: block;
            }
            .content {
                display: none;
                position: absolute;
                background-color: green;
                color: red;
                min-width: 160px;
                z-index: 1;
            }
            .all:hover .content{
                display: block;
            }
            .content a{
                display: block;
            }
            .maincontent {
                color: black;
            }
            .maincontent {
                background-color: gray;
                max-width: 50%;
                margin: 0 auto;
                display: block;
            }
            footer {
                background-color: blue;
                color: black;
            }
        </style>
        <div class="maincontent">
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
    </div>
    <nav class="side">
        <div>世界</div>
        <div>学习</div> 
        <div>美食</div>
        <div>电影</div>
        <div>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
        </div>
    </nav>    
    </main>
    <footer>
<p>
            今年12月4日是第九个国家宪法日,也是我国现行宪法公布实施四十周年。全面贯彻习近平新时代中国特色社会主义思想，学习宣传贯彻党的二十大精神，推动全面贯彻实施宪法，大力弘扬宪法精神，努力使尊法学法守法用法在全社会蔚然成风。
</p>
    </footer>
    </html>
